<html>
<#include "../common/header.ftl">

<body>
<#--头部栏-->
<#include "../common/top_nav.ftl">
<div id="wrapper " class="toggled">
    <div class="row clearfix">
        <div class="col-md-1 column">
        <#--左边栏sidebar-->
   <#include "../common/left_nav.ftl">
        </div>
    <#--主要内容content-->
        <div class="col-md-11 column">
            <h3 class="text-center">
                    ${form.formName}
            </h3>
            <div id="page-content-wrapper">
                <div class="container-fluid">
                    <div class="row clearfix">
                        <div class="col-md-12 column col-sm-offset-2 text-center">
                            <ul id="Huifold-demo1" class="Huifold "  style="width: 1100px">
                                <#list form.mainProblemDTOList as mainProblem>
                                <li class="item " >
                                    <h4 class="text-left youji"  id="${mainProblem.mainProblemId!}"> ${mainProblem_index+1!}、${mainProblem.mainProblemName!}<b>+</b></h4>
                                    <div class="info">
                                        <table class="table table-bordered table-condensed">
                                            <thead>
                                            <tr>
                                                <th>序号</th>
                                                <th>问题名称</th>
                                                <th>问题类型</th>
                                                <th>是否必答</th>
                                                <th colspan="2">操作</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                        <#list mainProblem.problemDetailDTOList as problemDetailDTO>
                        <tr>
                            <td> ${problemDetailDTO_index+1!}</td>
                            <td>${problemDetailDTO.problemName!}</td>
                            <td>
                                <#if problemDetailDTO.problemType==0>
                                    <span class="label label-info">单选</span>
                                 <#elseif  problemDetailDTO.problemType==1>
                                     <span class="label label-info">多选</span>
                                 <#elseif  problemDetailDTO.problemType==2>
                                     <span class="label label-info">评分</span>
                                 <#elseif  problemDetailDTO.problemType==3>
                                     <span class="label label-info">文字</span>
                                </#if>
                            </td>
                            <td>
                                <#if problemDetailDTO.isMust==0>
                                    <span class="label label-info">不必答</span>
                                  <#elseif problemDetailDTO.isMust==1>
                                     <span class="label label-info">必答</span>
                                </#if>
                            </td>
                            <td>
                                <a class="btn btn-default"
                                   onclick="show('编辑问题','/problem/edit?id=${problemDetailDTO.problemDetailId}&formid=${form.formId}',800,500)">编辑</a>
                                <button href="javascript:;" class="btn btn-default"
                                        onclick="doStatus('删除问题','/problem/doDelete','${problemDetailDTO.problemDetailId}','0')">
                                    删除
                                </button>
                            </td>
                        </tr>
                        </#list>
                                            </tbody>
                                        </table>
                                    </div>
                                </li>
                                </#list>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="../jqueryYoujian/js/contextMenu.js"></script>
<script>
    $("#Huifold-demo1").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:1,
        trigger:'click',
        className:"selected",
        speed:"first",
    });

    $("#Huifold-demo2").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:2,
        trigger:'click',
        className:"selected",
        speed:"first",
    });

    $("#Huifold-demo3").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:3,
        trigger:'click',
        className:"selected",
        speed:"first",
    });

    $("#Huifold-demo4").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:1,
        trigger:'mouseover',
        className:"selected",
        speed:"first",
    });

    $("#Huifold-demo5").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:2,
        trigger:'mouseover',
        className:"selected",
        speed:"first",
    });

    $("#Huifold-demo6").Huifold({
        titCell:'.item h4',
        mainCell:'.item .info',
        type:3,
        trigger:'mouseover',
        className:"selected",
        speed:"first",
    });
    var mainProblemId="";
    $(".youji").contextMenu({
        target: function(ele) { // 当前元素
            mainProblemId = ele[0].id;
          //  alert(ele[0].id);
          //  $(".ul-context-menu>li").attr("data-id", ele[0].id); //添加这行获取到当前点击对象的属性，这里我需要的是id，所以只添加了id
        },
        menu: [
            {
                text: "删除",
                icon:"../jqueryYoujian/img/del.png",
                callback: function(ele) {
                    doStatus('删除','/mainProblem/doDelete',mainProblemId,'')
                }
            }
        ]
    });
</script>

</body>
</html>
